import { ref } from 'vue';
import { ElMessage } from 'element-plus';

// 定义API方法接口，使用泛型参数T以支持不同类型的数据项
export interface ApiMethods {
  list: (data: any) => Promise<any[]>;
  create: (data: any) => Promise<void>;
  update: (data: any) => Promise<void>;
  delete: (id: any) => Promise<void>;
}

// useCrud自定义hook，用于管理CRUD操作
export default function useCrud(api: ApiMethods) {
  const modalRef = ref();

  // 使用ref创建响应式数据列表，类型为any[]
  const dataList = ref<any[]>([]);

  // 封装错误处理函数
  const handleError = (error: any) => {
    console.error('API Error:', error.message);
  };

  // 获取数据列表
  const list = async (item: any) => {
    try {
      const data = await api.list(item); // 更新响应式数据列表
      console.log('获取数据列表');
      console.log(data);
      dataList.value = data.list; // 更新响应式数据列表
    } catch (error) {
      handleError(error);
    }
  };

  // 添加数据项
  const create = async (item: any) => {
    try {
      await api.create(item);
      ElMessage.success('创建成功');
    } catch (error) {
      handleError(error);
    }
  };

  // 更新数据项
  const update = async (item: any) => {
    try {
      await api.update(item);
      ElMessage.success('更新成功');
    } catch (error) {
      handleError(error);
    }
  };

  // 删除数据项
  const del = async (id: any) => {
    try {
      await api.delete(id);
      ElMessage.success('删除成功');
    } catch (error) {
      handleError(error);
    }
  };

  // 返回hook的公共方法和响应式数据
  return {
    dataList,
    list,
    create,
    update,
    del,
    modalRef,
  };
}
